﻿/*----------------------------------------------------------
The base color for this template is #5c87b2. If you'd like
to use a different color start by replacing all instances of
#5c87b2 with your new color.
----------------------------------------------------------*/
body
{
    background: none repeat scroll 0 0 #303030;
    color: #878787;
}

a { text-decoration:none;}
p {color:#404040;}
#page { background:#181818; }

#topBanner,#bottomBanner  { background:#eee;}

#footer  { background:#282828}

#footerlinks {background:#181818;}

#footerlinks a {color:#6CC0E5}

#logo {  background:#eee; }

#logindisplay { background:#303030; }
#socialmediaicons { backgrounsd:#303030; float:right; width:auto; }
#socialmediaicons a {margin-right:5px; }
h4 { text-transform:uppercase;  color:#FB4F4F; font-weight: bold;}
.sharethis {background:#e8e8e8; border-radius: 7px; border:1px solid #ddd; }
.standardtext {color:#666;}    


#logindisplay a { color:#ddd; }

#main { background:#eee; }

#menu li { border:1px solid #181818; background:#303030; font-weight:bold; }
#menu li.selected { border:1px solid #181818; background:#505050; font-weight:bold; }
#menu li.title {background:#282828; color:#FBC93D}

#menu li a { color:#999; }
#menu li:hover {background:#505050}
#menu li.title:hover {background:#282828}
#menu li:hover a,#menu li.selected a  { color:#fff; }


#menustrapline { background:#6CC0E5;color:#333 }

h3 {font-weight:normal}
h1 {color:#ccd; }
.h1 {color:#ccd; }
h1 span.title,.h1 span.title {color:#FBC93D}
h1 span.categorytitle {color:#aaa}


.indexcolumn h1 { color:#6CC0E5; background: #fff; border-bottom:2px solid #6CC0E5}
.indexcolumn .h1 { color:#6CC0E5; background: #fff; border-bottom:2px solid #6CC0E5}
.indexcolumn .h3,.indexcolumn h3 {color:#404040;}
.indexcolumn .featured .h3 {color:#CCCCCC;}
.indexcolumn .featured h3 {color:#CCCCCC;}
.indexcolumn .popular .h3 {color:#CCCCCC;}

.h2 {color:#6CC0E5; }
h2 {color:#6CC0E5; }
.playlist .h2
{
    color: #54A76F;
}
.h3,h3 {color:#ccc; }
.playlistcontainer {background:#303030; }
.playlistcontainer li {border-top:1px solid #404040;  }
.playbullet,.playbullet-small {border:1px solid #6CC0E5; color:#fff; background:#6CC0E5;}
.playlist .playbullet-small {background:#54A76F}

.carousel .image{ background:#303030; }
li.title {color:#fff; background:#FB4F4F}

.indexcolumn li.title {border-bottom-width:0px;border-radius: 6px 6px 0px 0px;}

.playlistitem:hover .h2,
.playlist:hover .h2,
h2:hover

{
    color: #FBC93D;
}
.playlistitem:hover .h3,
.playlist:hover .h3
{
    color:#fff;
}


.indexcolumn .playlistitem:hover .h3
{
    color:#404040;
}
.indexcolumn .featured .playlistitem:hover .h3
{
    color:#fff;
}

.indexcolumn .popular .playlistitem:hover .h3
{
    color:#fff;
}

a .playduration { color:#fff; }
.indexcolumn ul li a .playduration{    color:#888; }

.indexcolumn ul {border-top: 1px dotted #aaa}
.indexcolumn ul.noborder {border-top-width:0px;}


.indexcolumn ul li {border-bottom: 1px dotted #aaa}
.indexcolumn ul li:hover {background:#e8e8e8;}
.indexcolumn ul li.title:hover {background:#FB4F4F;}


.topborder {border-top-color:#aaa; border-top-style:dotted; padding-top:10px;margin-bottom:10px; border-top-width:2px;}

a.highlight {background:#789; color:#ddd; padding:3px 5px; font-weight:bold; float:right;}
a.highlight:hover {color:#fff}

.playlistitem:hover .playbullet,.playlistitem:hover .playbullet-small
.playlist:hover .playbullet,.playlist:hover .playbullet-small
{
    background:#fff; color:#FBC93D; border-color:#404040
}

.featured {background:#567}
.popular {background:#306040}

.playlistitem .commentcount
{
    background: transparent url("/content/images/comment.png") top left no-repeat;
    color:#FBC93D;
}
.player .playlistcontainer li:hover {background:#3b3b3b} 
.player .playlistcontainer li.title:hover {background:#FB4F4F} 